From: Carlos Soriano Date: Tue, 18 Feb 2014 12:45:26 +0000 (+0100) Subject: popupMenu: Use an image for arrows X-Git-Tag: archive/raspbian/50.5-1+rpi1~1^2~1013^2^2~2740 X-Git-Url: https://dgit.raspbian.org/%22http://www.example.com/cgi/%22/%22http:/www.example.com/cgi/%22?a=commitdiff_plain;h=0418b68051e0bfec3e1a97344e105fa8c875ec05;p=gnome-shell.git popupMenu: Use an image for arrows Until now the arrows were the associated arrow character of the font. This cause some problems like different arrows for different fonts, and size can be altered because of the font size. To solve that, use an image for the arrows. https://bugzilla.gnome.org/show_bug.cgi?id=720206 --- diff --git a/data/Makefile.am b/data/Makefile.am index 4f91709d6..a73affd10 100644 --- a/data/Makefile.am +++ b/data/Makefile.am @@ -39,6 +39,7 @@ dist_theme_DATA = \ theme/filter-selected-rtl.svg \ theme/gnome-shell.css \ theme/logged-in-indicator.svg \ + theme/menu-arrow-symbolic.svg \ theme/message-tray-background.png \ theme/more-results.svg \ theme/noise-texture.png \ diff --git a/data/theme/gnome-shell.css b/data/theme/gnome-shell.css index 61a6284dd..4b0489011 100644 --- a/data/theme/gnome-shell.css +++ b/data/theme/gnome-shell.css @@ -157,8 +157,9 @@ StScrollBar StButton#vhandle:active { min-width: 200px; } -.unicode-arrow { - font-size: 120%; +.popup-menu-arrow { + width: 16px; + height: 16px; } .popup-submenu-menu-item:open { diff --git a/data/theme/menu-arrow-symbolic.svg b/data/theme/menu-arrow-symbolic.svg new file mode 100644 index 000000000..07acaa8e0 --- /dev/null +++ b/data/theme/menu-arrow-symbolic.svg @@ -0,0 +1,90 @@ + + + + + + + + + + + + + + + + + image/svg+xml + + + + + + + + + diff --git a/js/ui/panel.js b/js/ui/panel.js index cfa6fdb4e..e7f8df92a 100644 --- a/js/ui/panel.js +++ b/js/ui/panel.js @@ -213,7 +213,7 @@ const AppMenuButton = new Lang.Class({ this._label = new TextShadower(); this._label.actor.y_align = Clutter.ActorAlign.CENTER; this._hbox.add_actor(this._label.actor); - this._arrow = PopupMenu.unicodeArrow(St.Side.BOTTOM); + this._arrow = PopupMenu.arrowIcon(St.Side.BOTTOM); this._hbox.add_actor(this._arrow); this._iconBottomClip = 0; @@ -842,7 +842,7 @@ const AggregateMenu = new Lang.Class({ this._indicators.add_child(this._rfkill.indicators); this._indicators.add_child(this._volume.indicators); this._indicators.add_child(this._power.indicators); - this._indicators.add_child(PopupMenu.unicodeArrow(St.Side.BOTTOM)); + this._indicators.add_child(PopupMenu.arrowIcon(St.Side.BOTTOM)); this.menu.addMenuItem(this._volume.menu); this.menu.addMenuItem(this._brightness.menu); diff --git a/js/ui/popupMenu.js b/js/ui/popupMenu.js index b51c7c795..af0d9e19f 100644 --- a/js/ui/popupMenu.js +++ b/js/ui/popupMenu.js @@ -45,28 +45,35 @@ function isPopupMenuItemVisible(child) { /** * @side Side to which the arrow points. */ -function unicodeArrow(side) { - let arrowChar; +function arrowIcon(side) { + let rotation; switch (side) { case St.Side.TOP: - arrowChar = '\u25B4'; + rotation = 180; break; case St.Side.RIGHT: - arrowChar = '\u25B8'; + rotation = - 90; break; case St.Side.BOTTOM: - arrowChar = '\u25BE'; + rotation = 0; break; case St.Side.LEFT: - arrowChar = '\u25C2'; + rotation = 90; break; } - return new St.Label({ text: arrowChar, - style_class: 'unicode-arrow', - accessible_role: Atk.Role.ARROW, - y_expand: true, - y_align: Clutter.ActorAlign.CENTER }); + let gicon = new Gio.FileIcon({ file: Gio.File.new_for_path(global.datadir + + '/theme/menu-arrow-symbolic.svg') }); + + let arrow = new St.Icon({ style_class: 'popup-menu-arrow', + gicon: gicon, + accessible_role: Atk.Role.ARROW, + y_expand: true, + y_align: Clutter.ActorAlign.CENTER }); + + arrow.rotation_angle_z = rotation; + + return arrow; } const PopupBaseMenuItem = new Lang.Class({ @@ -993,7 +1000,7 @@ const PopupSubMenuMenuItem = new Lang.Class({ y_align: Clutter.ActorAlign.CENTER }); this.actor.add_child(this.status); - this._triangle = unicodeArrow(St.Side.RIGHT); + this._triangle = arrowIcon(St.Side.RIGHT); this._triangle.pivot_point = new Clutter.Point({ x: 0.5, y: 0.6 }); this._triangleBin = new St.Widget({ y_expand: true, diff --git a/js/ui/status/accessibility.js b/js/ui/status/accessibility.js index 1ed9bf62b..56f821180 100644 --- a/js/ui/status/accessibility.js +++ b/js/ui/status/accessibility.js @@ -44,7 +44,7 @@ const ATIndicator = new Lang.Class({ this._hbox = new St.BoxLayout({ style_class: 'panel-status-menu-box' }); this._hbox.add_child(new St.Icon({ style_class: 'system-status-icon', icon_name: 'preferences-desktop-accessibility-symbolic' })); - this._hbox.add_child(PopupMenu.unicodeArrow(St.Side.BOTTOM)); + this._hbox.add_child(PopupMenu.arrowIcon(St.Side.BOTTOM)); this.actor.add_child(this._hbox); diff --git a/js/ui/status/keyboard.js b/js/ui/status/keyboard.js index 8d9960ee1..8d6242da2 100644 --- a/js/ui/status/keyboard.js +++ b/js/ui/status/keyboard.js @@ -341,7 +341,7 @@ const InputSourceIndicator = new Lang.Class({ this._hbox = new St.BoxLayout({ style_class: 'panel-status-menu-box' }); this._hbox.add_child(this._container); - this._hbox.add_child(PopupMenu.unicodeArrow(St.Side.BOTTOM)); + this._hbox.add_child(PopupMenu.arrowIcon(St.Side.BOTTOM)); this.actor.add_child(this._hbox); this.actor.add_style_class_name('panel-status-button');